<div class="row" xmlns:th="http://www.thymeleaf.org">
    <div class="col-xs-6 col-md-3" th:each="item:${list}" th:object="${item}">
        <a class="fyl-cp thumbnail" th:data-id="*{id}">
            <!--<img class="lazy" data-src="holder.js/100%x180" th:alt="*{name}" style="height: 180px; width: 100%; display: block;"
                 th:src="${frdn}+*{imageUrl}" data-holder-rendered="true">-->
            <img class="lazy" th:alt="*{name}" style="height: 180px; width: 100%; display: block;"
                 th:data-original="${frdn}+*{imageUrl}" data-holder-rendered="true">
        </a>
    </div>
</div>
<script>
    var ids = [];
    $("a.thumbnail").click(function () {
        $(this).toggleClass("fyl-select");
        var id = $(this).data("id");
        var index = ids.indexOf(id);
        if ($(this).hasClass("fyl-select")) {
            if (index == -1) {
                ids.push(id);
            }
        } else {
            if (index > -1) {
                ids.splice(index, 1);
            }
        }
        $remove.prop('disabled', !(ids.length > 0));
        $update.prop('disabled', !(ids.length > 0));
    })
    //图片懒加载
    $(function() {
        imgLazy();
    })
</script>